<template>
		<div class="container">
		  <!--头部 start-->
		  <div class="top"> 
		     <div class="top_u">
		        <div class="shop_l">
		            <img class="shopImg" src="../../imgs/pic_top_01.png" />
		        </div>
		        <div class="shop_r">
		            <div class="shopName_1">晨曦火烧馆（2号）</div>
		            <div class="shopAddress">樟树市药都南大道158号 18770579291</div>
		        </div>
		     </div>
		     <div class="top_d">
		        <div class="userInfo" >
		              <img class="userImg" src="../../imgs/pic_top_tx_01.png" />
		              <img class="userImg" src="../../imgs/pic_top_tx_02.png" />
		              <img class="userImg" src="../../imgs/pic_top_tx_03.png" />
		              <img class="userImg" src="../../imgs/pic_top_tx_01.png" />
		              <img class="userImg" src="../../imgs/pic_top_tx_02.png" />
		              <img class="userImg" src="../../imgs/pic_top_tx_03.png" />
		              <img class="userImg" src="../../imgs/pic_top_tx_01.png" />
		              <img class="userImg" src="../../imgs/pic_top_tx_02.png" />
		              <img class="userImg" src="../../imgs/pic_top_tx_03.png" />
		        </div>
		        <div class="shopPhone" bindtap='callwaiter' >
		            <img class="shopPhoneImg" src="../../imgs/pic_top_02.png" />
		        </div>
		     </div>
		  </div>
		  <!--头部 end-->
		   <!--列表 start-->
		   <div class="food"> 
		      
		      <div class="food_l">
		         <div class="foodType" v-bind:class="{activity: isActivity}" @tap.stop.prevent="changeMenu($event)"> 
		            <img class="foodNavImg" src="../../imgs/pic_list_l_btn_01.png" />
		            <div class="foodNavText">热菜</div>
		         </div>
		         <div class="foodType" v-bind:class="{activity: isActivity}" @tap.stop.prevent="changeMenu($event)"> 
		            <img class="foodNavImg" src="../../imgs/pic_list_l_btn_02.png" />
		            <div class="foodNavText">凉菜</div>
		         </div>
		      </div>
		 
		      <div class="food_r">
		         <div class="food_r_title" id="">热菜</div>
		
		         <!--菜名列表循环 start-->
		         <div class="food_list">
		            <div class="food_list_l">
		               <img class="foodImg" src="../../imgs/pic_list_01.png"  />
		            </div> 
		            <div class="food_list_r">
		               <div class="food_list_t_1">清炒莴笋丝</div>
		               <div class="food_list_t_2">美味实惠又好吃</div>
		               <div class="food_list_t_3">￥18.00</div>
		               <div class="food_list_btn">
		                   <div class="food_list_btn_l" @tap.stop.prevent="foodDel($event)">
		                     <img class="foodDel" src="../../imgs/pic_list_03.png" ></image>
		                   </div>
		                   <div class="food_list_btn_c foodNum">{{foodNum}}</div>
		                   <div class="food_list_btn_r" @tap.stop.prevent="foodAdd($event)">
		                     <img class="foodAdd" src="../../imgs/pic_list_02.png" ></image>
		                   </div>
		               </div>
		            </div>
		         </div>
		         
		         <!--菜名列表循环 end-->
		      </div> 
		    
		   </div>
		   <!--列表 start-->
		   <!--底部 start-->
		   <div class="footer">
		      <div class="cart">
		         <img class="cartImg"   bindtap="goDetail" src="../../imgs/pic_footer_01.png" />
		         <span class="cartNum">28</span>
		      </div>
		      <div class="totalMoney"><span>￥</span>188.00</div>
		      
		      <div class="cart_btn">
		        <button class="cart_btn_b" @tap.stop.prevent="goOrder">查看订单</button>
		        <button class="cart_btn_b" @tap.stop.prevent="goCart">购物车</button>
		      </div>
		   </div>
		   <!--底部 start-->
		</div>
</template>
<script>
    export default{
        data(){
            return{
            	isActivity: false,
            	foodNum: 0
            }
        },
        mounted(){
        	/**
        	var _this = this;
        	app.api.merInfo.bankCards({
        		data: {
					cardType: _this.cardType
				},
        		success(result){
        			_this.bankCardsList = result.data;
        			console.log(result);
        		},
        		complete(){
        		}
        	});
        	**/
        },
        methods:{
			goOrder(){
				this.$router.push({name: "orderList"});
			},
			goCart(){
				this.$router.push({name: "cartView"});
			},
			changeMenu(e){
				var _this = this;
				_this.isActivity=true;
				console.log(e.currentTarget);
				//console.log(event.target);
			},
			foodAdd(e){
				var _this = this;
				_this.foodNum++;	
			},
			foodDel(e){
				var _this = this;
				if(_this.foodNum>0) _this.foodNum--;
			}
        }
    }
</script>
<style lang="less" scoped>
</style>